<div class="login-wapper">

    <div layout="row" layout-align="center center" class="login-content" ng-cloak>


        <md-whiteframe flex="50" class="md-whiteframe-1dp" style="padding:15px;background-color:rgba(255,255,255,0.3) ">
            <h1>
                系统登录
            </h1>
            <form name="userForm">
                <md-input-container class="md-block">
                    <label>用户名</label>
                    <input md-maxlength="20" md-minlength="20" required name="UserName" ng-model="User.Name">
                    <div class="hint" ng-if="showHints">输入您的账号</div>
                    <div ng-messages="userForm.UserName.$error">
                        <div ng-message="required">请填写登录用户</div>
                        <div ng-message="md-maxlength">登录用户不能超过20</div>
                        <div ng-message="md-minlength">登录用户不能小于20</div>
                    </div>
                </md-input-container>
                <md-input-container class="md-block">
                    <label>密码</label>
                    <input required name="Password" type="password" ng-model="User.Password">
                    <div ng-messages="userForm.Password.$error">
                        <div ng-message="required">密码必须填写</div>
                    </div>
                </md-input-container>
                <md-button ng-disabled="loadding" class="" ng-click="login()">
                    <span ng-if="loadding" flex><i class="fa fa-user"></i>登录中</span>
                    <span ng-if="!loadding" flex><i class="fa fa-user"></i>登录</span>
                </md-button>
            </form>

        </md-whiteframe>
    </div>
</div>
